<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>小说目录</title>

</head>
<style>
    .parent {
        border:1px solid blue;
overflow: hidden;
        width: 1000px;

margin-right: -24px;

}

.children {

float: left;
// 不使用 float ，display: inline-block;
border:1px solid red;

width: 300px;

height: 100px;

margin-right: 24px;

}
</style>
<body>

<h1>标题</h1>

<div class="parent">
    {% for c in novelCatalogue %}

    <a href="/fiction/index/{{ c.chapter_url }}/{{ c.index }}" class="children">{{ c.chapter_title }}</a>
    {% endfor %}
</div>



</body>
</html>